import {Button, Form, Input, Select} from "antd";
import {getAllDoctor} from "../../api/publicApi/publicApi.ts";
import {useEffect, useState} from "react";
import {addDepartment} from "../../api/hisComprehensive/hisApi.ts";
import {IDoctor, IOption} from "../../types/publicType/public.ts";
import {departmentNameRules, mainDoctorRules, SELECT_WIDTH} from "../../utils/publicStyleAndRules.ts";
import publicStyle from "../../assets/css/public.module.css";
import style from '../../assets/css/hosComprehensive/addDepart.module.css'


export default function AddDepartment() {
    // 表单
    const [dataForm] = Form.useForm();

    //  下拉列表
    const [options, setOptions] = useState<IOption[]>([]);

    // 获取所有医生数据
    const handelGetAllDoctor = async () => {
        const res = await getAllDoctor();
        if (res) {
            const data = res.data.map((item: IDoctor) => {
                return {
                    label: item.name,
                    value: item.name
                }
            });
            setOptions(data)
        }
    }

    // 添加科室
    const handelAddDepartment = async (data: object) => {
        const res = await addDepartment(data)
        if (res) {
            dataForm.setFieldsValue({})
        }
    }

    useEffect(() => {
        handelGetAllDoctor()
    }, []);

    // 提交表单
    const onFinish = async (values: any) => {
        await handelAddDepartment(values)
    };

    return (
        <div className={publicStyle.container}>
            <Form
                form={dataForm}
                colon={false}
                onFinish={onFinish}
                requiredMark={false}
            >
                <Form.Item label="科室名称" name="name" rules={departmentNameRules}>
                    <Input placeholder="输入科室名称" className={publicStyle.input}/>
                </Form.Item>
                <Form.Item label="科室主任" name="maindoctor" rules={mainDoctorRules}>
                    <Select
                        options={options}
                        defaultValue='全部医生'
                        style={{width: SELECT_WIDTH}}
                        className={publicStyle.input}
                    />
                </Form.Item>
                <Form.Item label="科室编号">
                    <Input disabled placeholder="系统自动生成" className={publicStyle.input}/>
                </Form.Item>
                <Form.Item label="创建时间">
                    <Input disabled placeholder="系统自动生成" className={publicStyle.input}/>
                </Form.Item>
                <Form.Item className={style.operation}>
                    <Button className={style.confirm} type="primary" htmlType="submit">确认创建</Button>
                    <Button className={style.back} type="default">返回上一级</Button>
                </Form.Item>
            </Form>
        </div>
    )
}
